<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>博客首页</title>
    <link rel="stylesheet" href="/public/css/bootstrap.min.css" type="text/css" />
    <link rel="stylesheet" href="/public/css/main.css" type="text/css" />
    <link rel="stylesheet" href="/public/font-awesome/css/font-awesome.min.css" type="text/css" />
    <script src="/public/js/jquery-2.1.0.min.js"></script>
    <script src="/public/js/index.js"></script>
</head>

<body>
    <header class="center-block">
        <div class="backimg">
            <img class="img-responsive" src="/public/images/banner_bg.jpg" alt="背景图" />
        </div>
        <div class="logo ">
            <span></span>
            <img class="img-circle" src="/public/images/logoIcon.jpg" alt="">
        </div>
    </header>
    <nav class="navbar navbar-default">
        <div class="container-fluid menu text-center">
            {% if category == '' %}
            <a href="/" class="text-primary">首页</a>
            {% else %}
            <a href="/" class="navbar-link">首页</a>
            {% endif %}
            {% for cate in categories %}
            {% if category == cate.id %}
            <a href="/?category={{cate.id}}" class="text-primary">{{cate.name}}</a>
            {% else %}
            <a href="/?category={{cate.id}}" class="navbar-link">{{cate.name}}</a>
            {% endif %}
            {% endfor %}
        </div>
    </nav>
    <main class="clear main">
        <div class="mainLeft pull-left">
            {% block content %}
            {% endblock %}
        </div>
        <div class="mainRight pull-right">
            {% if userInfo._id %}
            <div class="rightBox panel panel-default">
                <div class="title panel-heading"><span>用户信息</span></div>
                <div class="panel-body">
                    <p><span class="colDark">{{userInfo.username}}</span></p>
                    {% if !userInfo.isAdmin %}
                    <p><span class="colDanger info">您好，欢迎光临我的博客！</span></p>
                    {% else %}
                    <p>
                        <span class="colDanger  info">您好，管理员</span>
                        <a href="/admin" class="colMint">进入管理</a>
                    </p>
                    {% endif %}
                    <p><span class="colDark"><a href="javascript:;" id="logoutBtn">退出</a></span></p>
                </div>
            </div>
            {% else %}
            <div class="rightBox form hide panel panel-default" id="loginBox">
                <div class="title panel-heading"><span>登录</span></div>
                <div class="panel-body">
                    <div class="line form-group">
                        <span class="colDark">用户名：</span>
                        <input type="text" class="form-control"
                            name="username" id="username" />
                            <em></em>
                        </div>
                    <div class="line form-group"><span class="colDark">密码：</span><input type="password" class="form-control"
                            name="password" id="password" /><em></em></div>
                    <div class="line form-group">
                        <span class="colDark"></span>
                        <button class="btn btn-warning btn-block">登录</button>
                    </div>
                    <p class="textRight help-block">还没注册？<a href="javascript:;" class="colMint">马上注册</a></p>
                    <p class="colWarning textCenter"></p>
                </div>
            </div>
            <div class="rightBox form panel panel-default" id="registerBox">
                <div class="title panel-heading">
                    <span>注册</span>
                </div>
                <div class="panel-body">
                    <div class="line form-group">
                        <span class="colDark">用户名：</span>
                        <input type="text" class="form-control" name="username" id="regusername" />
                        <em></em>
                    </div>
                    <div class="line form-group">
                        <span class="colDark">密码：</span>
                        <input type="password" class="form-control" name="password" id="regpassword" />
                        <em></em>
                    </div>
                    <div class="line form-group">
                        <span class="colDark">确认：</span>
                        <input type="password" class="form-control" name="repassword" id="regrepassword" />
                        <em></em>
                    </div>
                    <div class="line form-group">
                        <span class="colDark"></span>
                        <button class="btn btn-warning btn-block">注册</button>
                    </div>
                    <p class="textRight help-block">已有帐号？
                        <a href="javascript:;" class="colMint">马上登录</a>
                    </p>
                    <p class="colWarning textCenter"></p>
                </div>
            </div>
            {% endif %}
            <div class="rightBox panel panel-default">
                <div class="title panel-heading">
                    <span>社区</span>
                </div>
                <div class="panel-body">
                    <p>
                        <a href="#" target="_blank">百度百科</a>
                    </p>
                    <p>
                        <a href="#" target="_balnk">思否</a>
                    </p>
                    <p>
                        <a href="#" target="_balnk">掘金</a>
                    </p>
                </div>

            </div>
        </div>
    </main>
</body>

</html>